<template>
  <div class="serve">
    <!-- 头部 -->
    <HeadPersonal></HeadPersonal>

    <!-- register -->
    <div class="register">
      <!-- registerOne -->
      <div class="registerOne">
        <div class="block">
          <div class="registerOneC">
            <div class="registerOneCNPC">
              <div class="registerOneCNPCNS">
                <p>1</p>
                <h4>填写手机号</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>2</p>
                <h4>输入密码</h4>
              </div>
              <div class="registerOneCNPCNS on">
                <p>3</p>
                <h4>输入邮箱</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>4</p>
                <h4>绑定微信</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>5</p>
                <h4>完成注册</h4>
              </div>
              <div class="clear"></div>
              <div class="registerOneCNPCNhr"></div>
            </div>
            <div class="registerOneCNMOB">
              <p>3</p>
              <h4>输入邮箱</h4>
            </div>
            <div class="registerOneCF">
              <div class="registerOneCFI">
                <p>邮箱</p>
                <div class="registerOneCFIi">
                  <input
                    type="text"
                    placeholder="请输入邮箱地址"
                    class="registerOneCFIinput"
                    v-model="email"
                  />
                </div>
              </div>
              <p class="registerOneCFE">认证以后可以用来找回密码</p>
              <div class="enrollPwdOneCsub" @click="next">下一步</div>
              <!-- <input type="submit" value="下一步" class="registerOneCFsub"/> -->
              <!-- <span class="registerOneCFsub1" @click="skip">跳过</span> -->
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 底部 -->
    <HomeHooter></HomeHooter>
  </div>
</template>

<script>
import $ from "jquery";
import "@/assets/css/home.css";
import "@/assets/css/personal.css";
import HeadPersonal from "@/components/headregister";
import HomeHooter from "@/components/footer";

export default {
  name: "register",
  data() {
    return {
      email: ""
    };
  },
  components: {
    HeadPersonal,
    HomeHooter
  },
  methods: {
    // 下一步
    next() {
      var reg = new RegExp(
        "^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"
      );
      if (this.email === "") {
        this.$message({
          message: "请输入邮箱",
          type: "warning"
        });
        return false;
      }
      // if (!reg.test(this.email)) {
      //   this.$message({
      //     message: "邮箱格式错误",
      //     type: "warning"
      //   });
      //   return false;
      // }
      this.$router.push({
        name: "register-registerFour",
        query: {
          phone: this.$route.query.phone,
          code: this.$route.query.code,
          password: this.$route.query.password,
          email: this.email
        }
      });
    }
  }
};
</script>

<style scoped>
</style>